<template>
  <el-card class="student-list-card">
    <h2>学生列表</h2>
    <el-form :inline="true" :model="searchForm" class="search-form" @submit.prevent>
      <el-form-item label="学历">
        <el-input v-model="searchForm.degree" placeholder="如 本科" clearable />
      </el-form-item>
      <el-form-item label="专业">
        <el-input v-model="searchForm.major" placeholder="如 计算机科学" clearable />
      </el-form-item>
      <el-form-item label="关键词">
        <el-input v-model="searchForm.keyword" placeholder="姓名/院校/证书" clearable />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="fetchStudents">筛选</el-button>
        <el-button @click="resetSearch">重置</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="students" stripe border class="student-table" v-loading="loading">
      <el-table-column prop="name" label="姓名" min-width="100" />
      <el-table-column prop="school" label="院校" min-width="120" />
      <el-table-column prop="major" label="专业" min-width="100" />
      <el-table-column prop="degree" label="学历" min-width="80" />
      <el-table-column prop="certificate" label="证书" min-width="120" />
      <el-table-column label="操作" min-width="220">
        <template #default="{ row }">
          <el-button type="primary" size="small" @click="viewResume(row)">查看简历</el-button>
          <el-button type="success" size="small" @click="openInvite(row)">邀请面试</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination-bar">
      <el-pagination
        background
        layout="prev, pager, next, jumper"
        :total="total"
        :page-size="searchForm.size"
        :current-page="searchForm.page"
        @current-change="onPageChange"
      />
    </div>
    <el-dialog v-model="showInviteForm" title="邀请学生面试" width="500px">
      <el-form :model="inviteForm" label-width="100px" style="max-width: 400px; margin: 0 auto;">
        <el-form-item label="岗位名称">
          <el-select v-model="inviteForm.positionId" placeholder="请选择岗位">
            <el-option v-for="item in positions" :key="item.id" :label="item.positionName" :value="item.id" />
          </el-select>
        </el-form-item>
        <el-form-item label="面试时间">
          <el-date-picker v-model="inviteForm.interviewTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" />
        </el-form-item>
        <el-form-item label="面试地点">
          <el-input v-model="inviteForm.interviewLocation" />
        </el-form-item>
        <el-form-item label="备注">
          <el-input v-model="inviteForm.remark" type="textarea" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onInvite" :loading="inviteLoading">发送邀请</el-button>
          <el-button @click="showInviteForm = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <el-dialog v-model="showResumeDialog" title="学生简历" width="700px">
      <div v-if="resumeMarkdown" style="max-height: 500px; overflow: auto;">
        <v-md-preview :text="resumeMarkdown" />
      </div>
    </el-dialog>
  </el-card>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { ElMessage } from 'element-plus'
import { searchStudents, inviteStudentInterview, getStudentResume, getEnterprisePositions } from '@/api/enterprise'
import '@kangc/v-md-editor/lib/style/preview.css'
import '@kangc/v-md-editor/lib/theme/style/vuepress.css'

const students = ref([])
const total = ref(0)
const loading = ref(false)
const searchForm = ref({ degree: '', major: '', keyword: '', page: 1, size: 10 })
const showInviteForm = ref(false)
const inviteForm = ref({ studentId: '', positionId: '', interviewTime: '', interviewLocation: '', remark: '' })
const inviteLoading = ref(false)
const showResumeDialog = ref(false)
const resumeMarkdown = ref('')
const positions = ref([])
const allStudents = ref([]) // 存储全部学生数据

const fetchPositions = async () => {
  try {
    const res = await getEnterprisePositions({ page: 1, size: 100 })
    positions.value = (res.data && res.data.list) ? res.data.list : (res.list || [])
  } catch (e) {}
}

const fetchStudents = async () => {
  loading.value = true
  try {
    const params = { ...searchForm.value }
    if (!params.degree) delete params.degree
    if (!params.major) delete params.major
    if (!params.keyword) delete params.keyword
    // 不传 page/size，获取全部
    const res = await searchStudents(params)
    const data = res.data || res
    allStudents.value = data.list || []
    total.value = allStudents.value.length
    // 只显示当前页的10条
    const start = (searchForm.value.page - 1) * searchForm.value.size
    const end = start + searchForm.value.size
    students.value = allStudents.value.slice(start, end)
  } catch (e) {}
  loading.value = false
}
const resetSearch = () => {
  searchForm.value = { degree: '', major: '', keyword: '', page: 1, size: 10 }
  fetchStudents()
}
const onPageChange = page => {
  searchForm.value.page = page
  // 只切片，不重新请求
  const start = (searchForm.value.page - 1) * searchForm.value.size
  const end = start + searchForm.value.size
  students.value = allStudents.value.slice(start, end)
}
const viewResume = async row => {
  try {
    const res = await getStudentResume(row.id)
    resumeMarkdown.value = res
    showResumeDialog.value = true
  } catch (e) {
    ElMessage.error('获取简历失败')
  }
}
const openInvite = row => {
  inviteForm.value = { studentId: row.id, positionId: '', interviewTime: '', interviewLocation: '', remark: '' }
  showInviteForm.value = true
  fetchPositions()
}
const onInvite = async () => {
  inviteLoading.value = true
  try {
    await inviteStudentInterview(inviteForm.value)
    ElMessage.success('面试邀请已发送')
    showInviteForm.value = false
  } catch (e) {}
  inviteLoading.value = false
}
onMounted(fetchStudents)
</script>

<style scoped>
.student-list-card {
  width: 100%;
  margin: 0;
  padding: 32px 32px 0 32px;
  box-sizing: border-box;
}
.invite-form-card {
  width: 100%;
  box-sizing: border-box;
}
.pagination-bar {
  text-align: right;
  margin-top: 10px;
}
.search-form {
  margin-bottom: 20px;
}
</style> 